<template>
  <div class="app-container">
    <!-- <app-header :showBorder="false"> </app-header> -->
    <div class="app-main">
      <div class="set-wrapper">
        <span>暂停派件</span>
        <mt-switch :model="sendStatus" :value="sendStatus" ref="switchR"  @change="change">{{msg}}</mt-switch>
      </div>
      <div class="desc">
        <img src="@/assets/images/common/warn.png" alt="" />
        <span>暂停派件开启后，你将无法接收到系统分配的任何申请</span>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { sendSetStatus, regetStatus } from "@/api/manager";
import {isSendList} from "@/utils/constant"
export default {
  name: "sendSet",
  data() {
    return {
      msg: "关闭",
      sendStatus: false
    };
  },
  computed: {
    ...mapGetters("app", ["send"])
  },
  created() {
  },
  mounted() {
    this.$refs.switchR.$el.children[2].classList.add("mint-switch-label-right")
    this.reloadUserInfo()
  },
  methods: {
    checkStatus() {
      let sw =  this.$store.getters['app/send']
      this.sendStatus = sw

      if(sw){
          this.msg="开启"
          this.$refs.switchR.$el.children[2].classList.remove("mint-switch-label-right")
          this.$refs.switchR.$el.children[2].classList.add("mint-switch-label-left")
        }else{
          this.msg ="关闭"
          this.$refs.switchR.$el.children[2].classList.add("mint-switch-label-right")
          this.$refs.switchR.$el.children[2].classList.remove("mint-switch-label-left")
        }
    },
    reloadUserInfo() {
      regetStatus({
        user_id: this.$store.getters["user/userId"]
      }).then( res => {
          let params = res.params
          if (res.respCode === "000000") {
            this.$store.dispatch("app/setSend",isSendList[params.inboxState]);
            this.checkStatus()
            // this.$refs.switchR.value = this.sendStatus
          }
      })
    },
    change() {
      sendSetStatus({
        inboxState: !this.send
      }).then(res => {
        if (res.respCode === "000000") {
          this.$store.dispatch("app/toggleSend");
          this.$store.getters.send ? this.msg=="开启":this.msg =="关闭"
          this.checkStatus()
          
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.app-main {
  .set-wrapper {
    margin-top: 0.1rem;
    height: 0.52rem;
    padding: 0 0.15rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #fff;
    font-size: 0.15rem;
    color: #333;
  }
  .desc {
    display: flex;
    align-items: center;
    margin: 0.15rem;
    margin-bottom: 0;
    font-size: 0.12rem;
    color: #999;
    img {
      width: 0.17rem;
      height: 0.17rem;
      margin-right: 0.05rem;
    }
  }
  
}
</style>
